$w: 26px;
$h: 26px;

$w_n: 20px;
$h_n: 20px;

/* ↓↓↓↓↓ 棋盘边框线条 ↓↓↓↓↓ */
/* 横 左 */
$w_left: 1, 10, 19, 28, 37, 46, 55, 64, 73, 82;
/* 横 右 */
$w_right: 9, 18, 27, 36, 45, 54, 63, 72, 81, 90;
/* 竖 上 */
$w_top: 1, 2, 3, 4, 5, 6, 7, 8, 9;
/* 竖 下 */
$w_down: 82, 83, 84, 85, 86, 87, 88, 89, 90;

/* ↓↓↓↓↓ 楚河汉界 ↓↓↓↓↓ */
/* 上边 */
$ch_top: 38, 39, 40, 41, 42, 43, 44;
/* 下边 */
$ch_down: 47, 48, 49, 50, 51, 52, 53;

/* ↓↓↓↓↓ 九宫格斜线 ↓↓↓↓↓ */
/* \ */
$slash_back: 4, 14, 67, 77;
/* / */
$slash: 5, 13, 68, 76;

/* ↓↓↓↓↓ 棋子初始定位 ↓↓↓↓↓ */
/* 右下 */
$position_r_b: 10, 16, 20, 22, 24, 26, 47, 49, 51, 53, 55, 61;
/* 左下 */
$position_l_b: 11, 17, 19, 21, 23, 25, 46, 48, 50, 52, 56, 62;
/* 左上 */
$position_l_t: 20, 26, 28, 30, 32, 34, 55, 57, 59, 61, 65, 71;
/* 右上 */
$position_r_t: 19, 25, 29, 31, 33, 35, 56, 58, 60, 62, 64, 70;

$lineColor: rgba(0, 0, 0);
$titlebarHeight: 28px;

/* 伪类 */
@mixin pseudo-class($w, $h) {
  position: absolute;
  content: "";
  width: $w;
  height: $h;
}

/* 九宫格斜线 */
@mixin lattice-line-rotate($rotate) {
  display: inline;
  position: absolute;
  background-color: $lineColor;
  height: 1px;
  width: 36.77px;
  height: 1px;
  left: 7.6px;
  top: calc(26px - 0.5px);
  transform: rotate(#{$rotate});
  z-index: 100;
}

/* 点位 */
@mixin lattice-line-mixin {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
  display: inline;
}

/* 点位线条 */
@mixin lattice-line-pseudo($position1, $position2) {
  @include pseudo-class(7px, 7px);
  border-#{$position1}: 1px solid $lineColor;
  border-#{$position2}: 1px solid $lineColor;
  #{$position1}: 3px;
  #{$position2}: 3px;
}
